function GetEle(ele) {
    if (typeof ele === 'string') {
        this.eles = document.querySelectorAll(ele);
    } else {
        this.eles = [ele];
    }
}


// $符号就是实例化对象   省略每一次的new
function $(ele) {
    return new GetEle(ele)
}



GetEle.prototype.hide = function () {
    // 隐藏了所有匹配的元素
    this.eles.forEach(v => {
        v.style.display = 'none';
    })
    return this
}


GetEle.prototype.show = function () {
    // 隐藏了所有匹配的元素
    this.eles.forEach(v => {
        v.style.display = 'block';
    })
    return this
}


// 获取内容 、 设置内容
// $('.a').text()   默认获取第一个
// $('p').text('hello world')
GetEle.prototype.text = function () {
    // 判断有没有参数
    if (arguments.length >= 1) {
        this.eles.forEach(v => {
            v.innerText = arguments[0];
        })
    } else {
        // 没有参数表示是在获取   默认返回第一个
        return this.eles[0].innerText
    }
    return this
}

GetEle.prototype.html = function () {
    // 判断有没有参数
    if (arguments.length >= 1) {
        this.eles.forEach(v => {
            v.innerHTML = arguments[0];
        })
    } else {
        // 没有参数表示是在获取   默认返回第一个
        return this.eles[0].innerHTML
    }
    return this
}


// addClass 添加一个或者多个类名
GetEle.prototype.addClass = function (a) {
    this.eles.forEach(v => {
        v.className += ' ' + a;
    })
    return this;
}


GetEle.prototype.removeClass = function (a) {
    this.eles.forEach(v => {
        v.classList.remove(a)
    })
    return this;
}


GetEle.prototype.css = function () {
    // 判断参数
    if (arguments.length === 1) {
        // 判断是不是对象

        // 参数是字符串  --- 获取这个样式
        if (typeof arguments[0] === 'string') {
            // 返回这个属性值
            // getComputedStyle(div).color 
            return getComputedStyle(this.eles[0])[arguments[0]]
        } else {
            // 参数是一个对象  --- 设置多个样式
            this.eles.forEach(v => {
                // 遍历对象
                // for (let key in arguments[0]) {
                //     v.style[key] = arguments[0][key];
                // }
                const obj = arguments[0];
                for (let key in obj) {
                    v.style[key] = obj[key];
                }
            })
        }

        // 参数有两个  设置一个样式
    } else {
        this.eles.forEach(v => {
            v.style[arguments[0]] = arguments[1]
        })
    }
    return this
}



GetEle.prototype.parent = function () {
    this.eles = [this.eles[0].parentElement];
    return this
}


GetEle.prototype.eq = function (i) {
    const p = this.eles[i];
    this.eles = [p];
    return this;
}


GetEle.prototype.index = function () {
    const oP = this.eles[0];
    const c = oP.parentElement.children;
    // for(let i = 0 ; i < c.length ; i++) {
    //     if(oP === c[i]) {
    //         return i
    //     }
    // }
    const arr = [...c];
    return arr.indexOf(oP);

}



GetEle.prototype.on = function () {
    const args = arguments;   // 变量把这个实参存起来
    if (arguments.length > 2) {
        // 三个参数
        this.eles.forEach(v => {
            v.addEventListener(args[0], function (e) {
                const target = e.target;
                // 第二个参数不确定的
                if (typeof args[1] === 'object') {   // 参数是对象(标签对象)
                    if (target === args[1]) {
                        args[2]()
                    }
                } else {    // 参数就是字符串
                    const oPs = v.querySelectorAll(args[1]);
                    oPs.forEach(vv => {
                        if (target === vv) {
                            args[2]()
                        }
                    })
                }
            })
        })
    } else {

        // 只有两个参数就直接绑定事件
        this.eles.forEach(v => {
            v.addEventListener(arguments[0], arguments[1])
        })
    }

}




GetEle.prototype.children = function () {
    const c = this.eles[0].children;
    // this.eles = c ;    // HTMLCollection   没有forEach这个方法
    this.eles = [...c];   // 
    return this
}

GetEle.prototype.find = function (ele) {
    const c = this.eles[0].querySelectorAll(ele);    // NodeList   本身就有forEach
    this.eles = c;
    return this
}


GetEle.prototype.next = function () {
    const p = this.eles[0].nextElementSibling;
    // this.eles = p 
    this.eles = [p];   // 是一个数组  ---  forEach
    return this;
}

GetEle.prototype.prev = function () {
    const p = this.eles[0].previousElementSibling;
    // this.eles = p 
    this.eles = [p];   // 是一个数组  ---  forEach
    return this;
}

// 当前元素的兄弟元素
GetEle.prototype.siblings = function () {
    // 先找到当前元素的父元素
    //     当前  this.eles[0]
    const p = this.eles[0].parentElement;
    const c = p.children;
    const arr = [...c];
    const arr2 = arr.filter(v => v !== this.eles[0]);
    // console.log(arr2)
    this.eles = arr2;
    return this;
}

